<template>
  <div class="transaction-service-list bg-c-fff right-height mb70">
    <p class="bread">
      <a href="javascript:void(0);" class="font-s-16">注册律师管理-律师信息管理</a>
    </p>
    <div class="content">
      <div class="seach">
        <input type="text" name="" class="input-css" v-model="keyWord" placeholder="律师/联系方式/律所">
        <button class="xl-btn-css blue-button vb"  @click="getListData(1)">搜索</button>
      </div>
      <table class="auto" width="100%">
        <tr>
          <th>律师姓名</th>
          <th>性别</th>
          <th>律师照片</th>
          <th>联系方式</th>
          <th>所属律所</th>
          <th>执业年限</th>
          <th>提交时间</th>
          <th>律师编号</th>
          <th>操作</th>
        </tr>
        <tr v-for="(item, index) in noSeeList">
          <td>{{item.lawyerName}}</td>
          <td>
            <div v-if="item.lawyerSex===0">男</div>
            <div v-else>女</div>
          </td>
          <td>
            <div class="preview-img">
              <img :src="item.lawyerPic">
            </div>
          </td>
          <td>{{item.phone}}</td>
          <td>{{item.firmName}}</td>
          <td>{{item.careerYear}}</td>
          <td>{{item.createTime}}</td>
          <td>
            <div v-if="item.sort<10">
              {{"00" + (item.sort)}}
            </div>
            <div v-else-if="item.sort<100">
              {{"0" + (item.sort)}}
            </div>
            <div v-else>
              {{item.sort}}
            </div>
          </td>
          <td>
            <button @click="onBtnClick(item.memberId)" class="blue-button small-btn-css">查看详情</button>
            <button @click="seeSortShow(item.id)" class="blue-button small-btn-css">律师排序</button>
          </td>
          <vodal :show="sortShow" animation="zoom" :width="400" :height="250" @hide="sortShow=false">
            <div class="vodal-main">
              <h4>合同审查表</h4>
              <div class="con">
                <p>请修改律师编号进行重新排序，编号越大显示越靠前</p>
                <p>律师编号:
                  <input type="text" class="input-css" v-model="number">
                </p>
              </div>
              <div class="tc auto vodal-btn-box">
                <button class="blue-button" @click="determine">确认</button>
                <button class="white-button" @click="sortShow= false">取消</button>
              </div>
            </div>
          </vodal>
        </tr>
      </table>
      <div class="fix foot-box">
        <pagination :index="index" :total="total"></pagination>
      </div>
    </div>
  </div>
</template>
<script type="text/javascript">
import Pagination from '../components/Pagination'
export default {
  components: {
    Pagination
  },
  data() {
    return {
      noSeeList: [],
      total: 1,
      index: 1,
      number: '0',
      sort: '',
      id: '',
      keyWord: '',
      sortShow: false
    }
  },
  mounted() {
    this.getListData(1)
  },
  methods: {
    seeSortShow(id) {
      this.sortShow = true
      this.id = id
    },
    getListData(page) {
      this.$http.get('/memberLawyer/getList/lawyer/background', {
        params: {
          search: this.keyWord,
          page: page,
          rows: 10
        }
      }).then(data => {
        if (data.data.httpCode === 200) {
          this.noSeeList = data.data.rows
          this.allIndex = data.data.page
          this.allTotal = Math.ceil(data.data.rows.length / 10)
          this.sort = parseInt(Math.random() * 1000 + 1)
        } else {
          this.$toasted.show(data.data.msg)
        }
      }).catch(err => {
        console.log(err)
        this.$toasted.show('网络出错！')
      })
    },
    onBtnClick(id) {
      this.$router.push('/lawye-details?id=' + id)
    },
    determine() {
      this.$http.post('/memberLawyer/modify/show/list', {
          id: this.id,
          number: this.number
      }).then(data => {
        if (data.data.httpCode === 200) {
          this.getListData(1)
        } else {
          this.$toasted.show(data.data.msg)
        }
      }).catch(err => {
        console.log(err)
        this.$toasted.show('网络出错!')
      })
      this.sortShow = false
    },
    getCount() {
      return parseInt(Math.random() * 1000 + 1)
    }
  }
}

</script>
<style type="text/css" scoped>
.right-height {
  min-height: 700px;
}

.bread {
  padding-left: 20px;
  border-bottom: 1px solid #ddd;
}

.bread a {
  line-height: 45px;
}

.bread button {
  right: 10px;
  top: 8px;
}

.content {
  padding: 0 30px;
}

.content .seach input,
.content .seach button {
  height: 35px;
  line-height: 35px;
}

.content .seach {
  padding: 20px 0px;
}

.content .seach button {
  margin-left: -5px;
}

.foot-box {
  padding: 35px 32px 15px 13px;
}

.preview-img {
  width: 120px;
}

.preview-img img {
  width: 60px;
  height: auto;
}

.vodal-main .con p:nth-of-type(2) {
  margin-left: 25px;
  margin-top: 20px;
}

.foot-box {
  padding: 35px 0px 0px 0px;
}

</style>
